/**
 */
Ext.define('vacake.view.Home', {
    extend: 'Ext.Panel',
    xtype: 'homeView',
    requires: [
            'Ext.carousel.Carousel',
            'Ext.dataview.List'
    ],
    config: {
        layout: {
            type: 'vbox',
            align: 'stretch'
        },
        scrollable: {
            direction: 'vertical',
            directionLock: true
        },

        items: [{
                xtype: 'toolbar',
                docked: 'top',
                title: 'vienna',
                items: [{
                        text: window.localStorage.getItem('app_district_name'),
                        id: 'select_area',
                        iconMask: true
                    }, {
                        xtype: "spacer"
                    }, {
                        text: '登录',
                        id: 'loginButton',
                        iconMask: true
                    }, {
                        text: '',
                        id: 'logoutButton',
                        iconMask: true,
                        hidden: true,
                        maxWidth: '22%'
                    }
                ]
            }, {
                xtype: 'carousel',
                direction: "horizontal",
                store: 'DistrictAdPic',
                height: '200px',
                id: 'homeCarousel',
                listeners: {
                    initialize: function(carousel) {
                        // init carousel data
                        var districtAdPic = Ext.getStore('DistrictAdPic');
                        var dataLength = 0;
                        var myAdPicItems = [];
                        districtAdPic.load({
                            params: {
                                cadid: window.localStorage.getItem('app_district_id'),
                                order:1
                            },
                            callback: function(data) {
                                if (data.length > 0) {
                                    dataLength = districtAdPic.getData().length;
                                    Ext.each(data, function(adPic) {
                                        myAdPicItems.push({
                                            xtype: 'panel',
                                            items: {
                                                html: "<img src='" + adPic.get('picUrl') + "' style='width:100%;height:100%;'  / >  < br > " + adPic.get('name')
                                            },
                                            listeners: {
                                                painted: function(panel) {
                                                    panel.on('tap', function() {
                                                        this.getParent().fireEvent('onTap', adPic.get('cdaid'), adPic.get('linkProduct'));
                                                        return false;
                                                    }, this);
                                                }
                                            }
                                        });
                                    });

                                    carousel.setItems(myAdPicItems);
                                    carousel.setActiveItem(0);
                                    setInterval(function() {
                                         if ( carousel.getItems().length> 0) {
                                            carousel.next();
                                            if (carousel.getActiveIndex() === (dataLength - 1)) {
                                                carousel.setActiveItem(0);
                                            }
                                        }
                                    }, 5000);
                                };

                            }

                        });

                    }
                }
            },{
                cls:'fenge'
            }, {
                xtype: 'list',
                id: 'productList',
                store: 'ProductRecommend',
                scrollable: false,
                height: '960px',
                onItemDisclosure: true,
                itemTpl:
                    "<div style='height:80px; position: relative'>" +
                        "<div style='position: absolute; top:-6px; right: -6px;'><img src='resources/images/buy_icon.png' height='32px;'></div>"+
                        "<img  src='{picurl}' style='float: left;height: 80px;width: 80px' class='radius'/> " +
                        "<div class='homelist_name height30 color2 font5'>{name}</div>" +
                        "<div class='homelist_name height30'><img src='resources/images/product_grade_{grade}.png' class='img97'></div>" +
                        "<div class='homelist_name height20 font5'><span class='color3'>{[values.standards[0].name]}" +
                            "<span class='color5' style='margin-left: 10px;'> " +
                                "{[values.isviewbate==1?values.standards[0].reprice:values.standards[0].price]}￥" +
                            "</span>" +
                        "</span></div>"+
                    "</div>"
            }
        ],
        listeners: {
            painted: function() {
                Ext.Viewport.mask({
                    xtype: 'loadmask',
                    message: '加载数据中...'
                });
                var productRecommend = Ext.getStore('ProductRecommend');
                if (productRecommend.find('cadid', window.localStorage.getItem('app_district_id')) == -1) {
                    productRecommend.load({
                        params: {
                            cadid: window.localStorage.getItem('app_district_id')
                        },
                        callback: function(data) {
                              if(data.length>0){
                            Ext.getCmp('productList').setHeight('' + data.length * 96 + 'px');
                        }
                        }
                    });
                }
                Ext.getCmp('select_area').setText(window.localStorage.getItem('app_district_name'));
                var loginId = window.localStorage.getItem('app_Login_id');
                var loginName = window.localStorage.getItem('app_Login_name');
                if (loginId != null && loginName != null) {
                    Ext.getCmp('loginButton').setHidden(true);
                    Ext.getCmp('logoutButton').setText(loginName);
                    Ext.getCmp('logoutButton').setHidden(false);
                } else {
                    Ext.getCmp('logoutButton').setHidden(true);
                    Ext.getCmp('loginButton').setHidden(false);
                }
                var productStore = Ext.getStore('ProductRecommend');

                Ext.Viewport.unmask();
            }
        }
    }
});